<div id="assistAccounting" class="clearfix">
  <div class="absolute fin_menu border">
    <div class="color-gray line-height-45" style="background:rgba(239,239,239,1);">账套名称</div>
    <div class="absolute" style="top: 45px;bottom: 0px;width: 100%;">
      <vue-scroll :ops="ops" style="height: 100%;">
        <ul>
          <li class="line-height-45 border-b cursor relative" @click="selectAccounting(item)"
            :class="{active: accountingSelectId == item.id}" v-for="(item, index) in accountingArr">
            {{ item.name }}
          </li>
        </ul>
      </vue-scroll>
    </div>
  </div>

  <div class="fin_add pull-right mt-10 border" v-if="!entryId">
    <div class="color-gray line-height-45 pl-12 clearfix" style="background:rgba(239,239,239,1);">
      <span>辅助核算</span>
      <div class="line-height-45 pull-right mr-10 cursor" style="color:#666" @click="addFun">
        <span class="icon-Org-account color-primary"></span>
        新增辅助核算
      </div>
    </div>
    <div class="border mt-10 mlr-10 mb-10 line-height-40 text-center global_table">
      <div class="dy-flex color-666 font-nm color-gray global_table_title">
        <div class="dy-fx-1 border-r">核算方法名称</div>
        <div class="dy-fx-1 border-r">业务对象</div>
        <div class="dy-fx-1 border-r">业务对象数量</div>
        <div class="dy-fx-1 border-r">说明</div>
        <div class="dy-fx-1">操作</div>
      </div>
      <div class="dy-flex border-t tableList" v-for="(item, index) in tableList">
        <div class="dy-fx-1 dy-flex border-r aijc" :title="item.assistName">{{item.assistName || '--'}}</div>
        <div class="dy-fx-1 dy-flex border-r aijc" :title="item.businessTypeValue">{{item.businessTypeValue || '--'}}
        </div>
        <div class="dy-fx-1 dy-flex border-r aijc" :title="item.businessCount">{{item.businessCount}}</div>
        <div class="dy-fx-1 dy-flex border-r aijc" :title="item.memo">{{item.memo || '--'}}</div>
        <div class="dy-fx-1">
          <a @click="editItem(item)">编辑</a>
          <a @click="entryFun(item.id)">录入明细</a>
          <a @click="delItem(item.id)">删除</a>
        </div>
      </div>
    </div>
  </div>


  <div class="fin_add pull-right mt-10 border" v-else>
    <div class="color-gray line-height-45 pl-12 clearfix" style="background:rgba(239,239,239,1);">
      <span>辅助核算</span>
      <hl-button size="mini" class="pull-right mt_5" @on-click="entryId = ''">返回</hl-button>
      <!-- <hl-button size="mini" class="pull-right mt_5 mr-10">导入</hl-button> -->
    </div>

    <div class="global_search ml-10 mt-10">
      <span class="icon-Gm-search"></span>
      <input v-model="keyword" autocomplete="off" type="text" class="global_ipt_text" placeholder="核算对象名称"
        @change="getDetailList('search')" />
    </div>

    <div class="border mt-10 mlr-10 mb-10 line-height-40 text-center global_table">
      <div class="dy-flex color-666 font-nm color-gray global_table_title">
        <div class="dy-fx-1 border-r">核算对象名称</div>
        <div class="dy-fx-1 border-r">核算代码</div>
        <div class="dy-fx-1 border-r">核算名称</div>
        <div class="dy-fx-1">操作</div>
      </div>
      <div class="dy-flex border-t" v-for="(item, index) in detailList">
        <div class="dy-fx-1 dy-flex border-r aijc" :title="item.assistObjectName">{{item.assistObjectName || '--'}}
        </div>
        <div class="dy-fx-1 dy-flex border-r aijc">
          <span v-if="!item.isEdit" :title="item.assistCode">{{item.assistCode || '--'}}</span>
          <input type="text" class="form-control" style="width: 180px;" v-model="item.assistCodeCopy" v-else>
        </div>
        <div class="dy-fx-1 dy-flex border-r aijc">
          <span v-if="!item.isEdit" :title="item.assistName">{{item.assistName || '--'}}</span>
          <input type="text" class="form-control" style="width: 180px;" v-model="item.assistNameCopy" v-else>
        </div>
        <div class="dy-fx-1">
          <a @click="editDetailItem(index)" v-if="!item.isEdit">编辑</a>
          <a @click="saveDetailItem(item)" v-if="item.isEdit">保存</a>
          <a @click="item.isEdit = false" v-if="item.isEdit">取消</a>
          <a @click="delDetailItem(item.id)" v-if="!item.isEdit">删除</a>
        </div>
      </div>
    </div>
    <div class="user-page pl-24 pr-24 ptb-10 clearfix">
      <div class="pull-left user-page-num">
        <span class="font-14">共<i>{{totalCount}}</i>条记录</span>
        <span>每页<hl-select :data="pageLimits" v-model="limit" width="80" @on-change="updateLimit"></hl-select>条</span>
      </div>
      <div class="pull-right">
        <hl-pagination v-model="currentPage" :total="totalPage" @change="getDetailList"></hl-pagination>
      </div>
    </div>
  </div>




  <hl-dialog :visible="dialogFlag" :title="!editId ? '新增辅助核算':'编辑辅助核算'" @on-close="dialogFlag = false">
    <div class="dy-flex">
      <div class="dy-fx-2 line-height-34 text_r">核算方法名称：</div>
      <div class="dy-fx-6">
        <input type="text" class="form-control" style="width: 320px;" v-model="assistName">
      </div>
    </div>
    <div class="dy-flex mt-10">
      <div class="dy-fx-2 line-height-34 text_r">业务对象：</div>
      <div class="dy-fx-6">
        <span v-if="editId" class="line-height-34">{{businessTypeValue}}</span>
        <hl-select v-else :data="dictList" type="primary" width="126" v-model="businessType"></hl-select>
      </div>
    </div>
    <div class="dy-flex mt-10">
      <div class="dy-fx-2 line-height-34 text_r">说明：</div>
      <div class="dy-fx-6">
        <textarea class="form-control" style="width: 320px;" rows="10" v-model="memo"></textarea>
      </div>
    </div>
    <div slot="footer">
      <hl-button type="primary" @on-click="submitFun">确定</hl-button>
      <hl-button type="outline" @on-click="dialogFlag = false">取消</hl-button>
    </div>
  </hl-dialog>

</div>

<style type="text/css">
  .tableList>div {
    white-space: normal;
    word-break: break-all;
  }

  .mt_5 {
    margin-top: 5px;
  }

  .text_r {
    text-align: right;
  }

  .aijc {
    align-items: center;
    justify-content: center;
  }

  .fin_menu {
    width: 230px;
    left: 0;
    top: 66px;
    bottom: 0;
    border-left: 0;
    text-indent: 15px;
    border-top-right-radius: 4px;
  }

  .fin_menu li:hover span {
    display: block;
  }

  .fin_menu li:hover {
    background: rgba(247, 247, 247, 1);
  }

  .fin_add {
    width: 785px;
    border-top-left-radius: 4px;
  }

  .fin_menu li.active {
    background-color: #5e67a5;
    color: #fff;
  }
</style>

<script src="modules/system_config/scripts/assist_accounting.js" charset="utf-8"></script>